<template>
	<u-modal :show="show" :negativeTop="200" :title="title" confirmText="确定" showCancelButton confirmColor="#FD8906"
		cancelColor="#000" @confirm="save" @cancel="show = false" @close="show = false" zoom>
		<view class="f-1 w100 f14">
			<view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10"><text class="crb">*</text>排序</view>
				<view class="f-g-1">
					<u--input placeholder="请输入排序" :customStyl="{background:'#f3f3f3'}" v-model="form.sort" type="number">
					</u--input>
				</view>
			</view>
			<view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10"><text class="crb">*</text>分类名称</view>
				<view class="f-g-1">
					<u--input placeholder="请输入分类名称" :customStyl="{background:'#f3f3f3'}" v-model="form.name">
					</u--input>
				</view>
			</view>
			<!-- <view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10">分类图标</view>
				<view class="f-g-1">
					<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" uploadIcon="plus"
						name="1" :maxCount="1"></u-upload>
				</view>
			</view>
			<view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10">分类描述</view>
				<view class="f-g-1">
					<u--input placeholder="请输入分类描述" :customStyl="{background:'#f3f3f3'}" v-model="form.notes">
					</u--input>
				</view>
			</view>
			<view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10">分类标签</view>
				<view class="f-g-1">
					<uni-data-select v-model="form.labelId" :localdata="labelList"
						placeholder="请选择分类标签"></uni-data-select>
				</view>
			</view>
			<view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10">分时段销售</view>
				<view class="f-g-1">
					<view class="f-bt f-y-c">
						<u-switch v-model="form.salesTimeSwitch" :inactiveValue="0" :activeValue="1"
							:activeColor="subColor" size="20">
						</u-switch>
						<view class="flex f12 f-g-1 ml10 f-x-e">
							<view
								v-if="form.salesTimeSwitch && form.salesTimeData.week && form.salesTimeData.week.length && form.salesTimeData.times && form.salesTimeData.times.length"
								class="f-c-e">
								<view class="flex">
									<view v-for="(v,i) in form.salesTimeData.week" :key="i">
										<text v-if="v==1" class="mr5">周一</text>
										<text v-if="v==2" class="mr5">周二</text>
										<text v-if="v==3" class="mr5">周三</text>
										<text v-if="v==4" class="mr5">周四</text>
										<text v-if="v==5" class="mr5">周五</text>
										<text v-if="v==6">周六</text>
										<text v-if="v==0" class="mr5">周日</text>
									</view>
								</view>
								<view class="mt5">
									<view v-for="(v,i) in form.salesTimeData.times" :key="i">
										{{v.start}} ~ <text v-if="v.ciri">次日</text>{{v.end}}
									</view>
								</view>
							</view>
							<view class="f-y-c ml10" @click="toTime" v-if="form.salesTimeSwitch==1">
								<text>编辑</text>
								<u-icon slot="right" size="14" color="#999" name="arrow-right"></u-icon>
							</view>
						</view>
					</view>
				</view>
			</view> -->
			<view class="p-10-0 f-bt f-y-c">
				<view class="left c9 f-g-0 mr10">小程序是否展示</view>
				<view class="f-g-1">
					<uni-data-checkbox v-model="form.is_display" :localdata="is_display"
						@change="deliverChange"></uni-data-checkbox>
				</view>
			</view>
		</view>
	</u-modal>
</template>

<script>
	import {
		mapState,
	} from 'vuex'
	import site from '@/custom/siteroot.js';
	import config from '@/custom/config.js';
	export default {
		components: {

		},
		props: {
			mode: {
				type: String,
				default: () => 'single'
			},
			v: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				subColor: uni.getStorageSync('subject_color'),
				form: {
					sort: '',
					name: '',
					is_display: 1
					// salesTimeSwitch: 0,
					// isMust: 0,
					// salesTimeData: {
					// 	week: [],
					// 	times: [],
					// }
				},
				fileList1: [],
				labelList: [],
				show: false,
				is_display: [{
						text: "显示",
						value: 1
					},
					{
						text: "不显示",
						value: 0
					}
				],
			}
		},
		computed: {
			...mapState({
				storeId: state => state.storeId,
			}),
		},
		methods: {
			deliverChange(e) {
				console.log(e)
			},
			open(v) {
				if (v && v.id) {
					this.title = '编辑分类'
					this.form = JSON.parse(JSON.stringify(v))
					// if (this.form && this.form.logo) {
					// 	this.fileList1 = []
					// 	this.fileList1.push({
					// 		url: this.form.logo
					// 	})
					// }
				} else {
					this.title = '新增分类'
					this.form = {
						sort: '',
						name: '',
						is_display: ''
						// logo: '',
						// salesTimeSwitch: 0,
						// isMust: 0,
						// salesTimeData: {
						// 	week: [],
						// 	times: [],
						// }
					}
					// this.fileList1 = []
				}
				this.show = true
				// this.getGoodsLabelList()
			},
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			async afterRead(event) {
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: `${uni.getStorageSync('siteroot')}/channel/file/upload`,
						filePath: url,
						name: 'file',
						header: {
							contentType: config.contentType,
							appType: 'store',
							uniacid: uni.getStorageSync('uniacid'),
							storeId: uni.getStorageSync('storeId'),
							Authorization: `Bearer ${uni.getStorageSync('token')}`,
						},
						success: (res) => {
							let r = JSON.parse(res.data)
							if (r && r.code == 400) {
								uni.showToast({
									title: r.msg || r.code,
									icon: 'none',
									duration: 2000
								})
							} else {
								setTimeout(() => {
									let d = JSON.parse(res.data)
									resolve(d.data)
								}, 500)
							}
						}
					});
				})
			},
			async getGoodsLabelList() {
				const {
					data: {
						list
					}
				} = await this.beg.request({
					url: this.api.goodsCatLabelList,
					data: {
						pageNo: 1,
						pageSize: 999
					}
				})
				this.labelList = list.map(v => ({
					text: v.name,
					value: v.id
				}))
			},
			close() {
				this.show = false
			},
			// fetchData(){
			// 	this.$emit('fetchData')
			// },
			toTime() {
				let time = {}
				time.week = this.form.salesTimeData.week
				time.times = this.form.salesTimeData.times
				uni.navigateTo({
					url: `/pages/mine/spgl/time?form=${JSON.stringify(time)}`
				})
			},
			rfTime(v) {
				this.form.salesTimeData = v
			},
			async save() {
				if (!this.form.sort) {
					return uni.showToast({
						title: '请输入排序',
						icon: 'none'
					})

				}
				if (!this.form.name) {
					return uni.showToast({
						title: '请输入名称',
						icon: 'none'
					})
				}
				// if (!this.form.is_display) {
				// 	return uni.showToast({
				// 		title: '请选择小程序是否展示',
				// 		icon: 'none'
				// 	})
				// }
				// if (this.fileList1.length) {
				// 	this.form.logo = ''
				// 	this.fileList1.forEach(v => {
				// 		this.form.logo = v.url
				// 	})
				// } else {
				// 	this.form.logo = ''
				// }
				// this.form.storeId = this.storeId
				// const {
				// 	msg
				// } = await this.beg.request({
				// 	url: this.form.id ? `${this.api.goodsCatList}/${this.form.id}` : this.api.goodsCatList,
				// 	method: this.form.id ? 'PUT' : 'POST',
				// 	data: this.form
				// })
				// uni.showToast({
				// 	title: msg,
				// 	icon: 'none'
				// })
				// this.show = false
				// this.form = {
				// 	sort: 1,
				// 	name: '',
				// 	logo: '',
				// 	salesTimeSwitch: 0,
				// 	isMust: 0,
				// 	salesTimeData: {
				// 		week: [],
				// 		times: [],
				// 	}
				// }
				// this.fileList1 = []
				// this.$emit('save')
				this.beg.request({
					url: '/admin/product.ProductClass/save',
					method: 'post',
					data: this.form
				}).then(res => {
					console.log(res)
					this.show = false
					if (res.code == 1) {
						uni.showToast({
							title: '操作成功'
						})
						this.$emit('save')
					} else {
						uni.showToast({
							title: '操作失败',
							icon: 'error'
						})
					}
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	.left {
		width: 140rpx;
		text-align: right;
	}
</style>